<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
  <title>智慧农业云服务-首页</title>
  <link rel="stylesheet" href="/layui/css/layui.css">
  <link rel="stylesheet" href="/css/index.css">
    <style>
        .nav.index {
            background: rgba(33, 33, 33 ,1);
        }
        .nav .layui-nav .layui-nav-item a {
            color: #8890a4;
        }
        #banner,#banner img {
          height: 700px !important;
        }
        .main-product {
          padding-top: 15px;
        }
        .nav .layui-nav .layui-nav-item {
            margin: 0 35px;
        }
        .nav .layui-nav * {
            font-size: 16px;
        }
        .layui-carousel-ind {
            top: -160px;
        }
        /*导航下图标信息*/
        .hp-online {
            min-width: 1300px;
            width: 100%;
            height: 121px;
            background: rgba(41,44,54,0.9);
            position: absolute;
            margin-top: -121px;
            z-index: 1;
        }
        .hp-online .online-container {
            overflow: hidden;
            margin: 0 auto;
        }
        .flex {
            display: -moz-box;
            display: -webkit-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
        }
        .PAGE_WIDTH {
            width: 1200px;
        }
        .hp-online .online-container .online-box {
            width: 25%;
            float: left;
            flex: 1;
            height: 121px;
            box-sizing: border-box;
            -moz-transition: all .4s ease 0s;
            -webkit-transition: all .4s ease 0s;
            -ms-transition: all .4s ease 0s;
            -webkit-transition: all .4s ease 0s;
            transition: all .4s ease 0s;
        }
        .hp-online .online-container .online-box a {
            box-sizing: border-box;
            display: inline-block;
            width: 100%;
            height: 100%;
            padding: 35px 0px 0px 21px;
            color: #8890a4;
            -moz-transition: all .4s ease 0s;
            -webkit-transition: all .4s ease 0s;
            -ms-transition: all .4s ease 0s;
            -webkit-transition: all .4s ease 0s;
            transition: all .4s ease 0s;
            overflow: hidden;
        }
        a {
            background: transparent;
            text-decoration: none;
            color: #08c;
        }
        .hp-online .online-container .online-box .icon {
            padding-top: 5px;
            width: 38px;
            height: 43px;
            -moz-transition: all .4s ease 0s;
            -webkit-transition: all .4s ease 0s;
            -ms-transition: all .4s ease 0s;
            -webkit-transition: all .4s ease 0s;
            transition: all .4s ease 0s;
            fill: #8890a4;
            margin-bottom: 25px;
        }
        .hp-online .online-container .online-box a svg {
            float: left;
            margin-right: 11px;
        }
        svg:not(:root) {
            overflow: hidden;
        }
        .hp-online .online-container .online-box a div {
            float: left;
            padding: 5px;
        }
        .hp-online .online-container .online-box:hover {
            background-color: #14161b;
        }
        .hp-online .online-container .online-box a div .title1 {
            font-size: 16px;
        }
        .footer {
            background: #2e3037;
        }
    </style>
</head>
<body>
  <!-- nav部分 -->
  <div class="nav index">
    <div class="layui-container">
      <!-- 公司logo -->
      <div class="nav-logo">
        <a href="index.html">
          <img width="200" height="50" src="/img/index/logo1.png" alt="智慧农业">
        </a>
      </div>
      <div class="nav-list">
        <button>
          <span></span><span></span><span></span>
        </button>
        <ul class="layui-nav" lay-filter="">
          <li class="layui-nav-item"><a href="/">首页</a></li>
          <li class="layui-nav-item"><a href="/">产品溯源</a></li>
          <li class="layui-nav-item"><a href="/">农技服务</a></li>
          <li class="layui-nav-item"><a href="/">农业商城</a></li>
          <li class="layui-nav-item"><a href="/">反馈与帮助</a></li>
          <li class="layui-nav-item"><a href="http://localhost:8084" target="_blank">控制台</a></li>
        </ul>
      </div>
    </div>
  </div>
  <!-- banner部分 -->
  <div>
    <div class="layui-carousel" id="banner">
      <div carousel-item>
        <div>
          <img src="/img/index/banner1.jpg">
          <div class="panel">
            <p class="title">智慧农业云服务</p>
            <p>完美产品体验</p>
          </div>
        </div>
        <div>
          <img src="/img/index/banner1.jpg">
          <div class="panel">
            <p class="title">智慧农业云服务</p>
            <p>完美产品体验</p>
          </div>
        </div>
      </div>
        <div class="hp-online">
            <div class="PAGE_WIDTH flex online-container">

                <div class="online-box">
                    <a href="/" >
                        <i style="float: left;font-size: 35px;padding: 5px;padding-right: 20px;" class="layui-icon layui-icon-console"></i>
                        <div>
                            <p class="title1">
                                智慧农业行业解决方案
                            </p>
                            <p class="title2">场景化服务全面升级</p>
                        </div>
                    </a>
                </div>
                <div class="online-box">
                    <a href="/" >
                        <i style="float: left;font-size: 35px;padding: 5px;padding-right: 20px;" class="layui-icon layui-icon-chart"></i>
                        <div>
                            <p class="title1">
                                大数据分析工具
                            </p>
                            <p class="title2">全方位解析数据</p>
                        </div>
                    </a>
                </div>
                <div class="online-box">
                    <a href="/" >
                        <i style="float: left;font-size: 35px;padding: 5px;padding-right: 20px;" class="layui-icon layui-icon-website"></i>
                        <div>
                            <p class="title1">
                                农业产品溯源解决方案
                            </p>
                            <p class="title2">感谢开发者的支持与陪伴</p>
                        </div>
                    </a>
                </div>
                <div class="online-box">
                    <a href="/" >
                        <i style="float: left;font-size: 35px;padding: 5px;padding-right: 20px;" class="layui-icon layui-icon-template"></i>
                        <div>
                            <p class="title1">
                                农技个性化推荐服务
                            </p>
                            <p class="title2">请各位开发者及时关注</p>
                        </div>
                    </a>
                </div>

            </div>
        </div>
    </div>
  </div>
  <!-- main部分 -->
  <div class="main-product">
    <div class="layui-container">
      <p class="title">专为农业而研制的<span>云产品</span></p>
      <div class="layui-row layui-col-space25">
        <div class="layui-col-sm6 layui-col-md3">
          <div class="content">
            <div><img src="/img/index/Big_icon1.png"></div>
            <div>
              <p class="label">物联网监控</p>
              <p>实时监控产业生产环境，为用户提供一个良好的可视化平台</p>
            </div>
            <a href="javascript:;">查看产品 ></a>
          </div>
        </div>
        <div class="layui-col-sm6 layui-col-md3 ">
          <div class="content">
            <div><img src="/img/index/Big_icon2.png"></div>
            <div>
              <p class="label">产品溯源</p>
              <p>从开始到结束，追踪产品的整个生产过程，质量可追踪，为用户提供一个安全放心可靠的产品</p>
            </div>
            <a href="javascript:;">查看产品 ></a>
          </div>
        </div>
        <div class="layui-col-sm6 layui-col-md3 ">
          <div class="content">
            <div><img src="/img/index/Big_icon3.png"></div>
            <div>
              <p class="label">农业电商平台</p>
              <p>为用户展示质量优质的农产品，追溯质量，展示当前农产品的市场行情。</p>
            </div>
            <a href="javascript:;">查看产品 ></a>
          </div>
        </div>
        <div class="layui-col-sm6 layui-col-md3 ">
          <div class="content">
            <div><img src="/img/index/Big_icon4.png"></div>
            <div>
              <p class="label">农技服务</p>
              <p>为用户的生产提供可考的理论支持，个性化推荐农技，为您量身定制农技服务</p>
            </div>
            <a href="javascript:;">查看产品 ></a>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="main-service">
    <div class="layui-container">
      <p class="title">为客户打造完美的<span>专业服务</span></p>
      <div class="layui-row layui-col-space25 layui-col-space80">
        <div class="layui-col-sm6">
          <div class="content">
            <div class="content-left"><img src="/img/index/home_img1.jpg"></div>
            <div class="content-right">
              <p class="label">1 对 1 专业指导</p>
              <span></span>
              <p>为客户提供一整套农业产业链的服务。为客户提供一整套农业产业链的服务。</p>
            </div>
          </div>
        </div>
        <div class="layui-col-sm6">
          <div class="content">
            <div class="content-left"><img src="/img/index/home_img2.jpg"></div>
            <div class="content-right">
              <p class="label">1 对 1 专业指导</p>
              <span></span>
              <p>为客户提供一整套农业产业链的服务。为客户提供一整套农业产业链的服务。</p>
            </div>
          </div>
        </div>
        <div class="layui-col-sm6">
          <div class="content">
            <div class="content-left"><img src="/img/index/home_img3.jpg"></div>
            <div class="content-right">
              <p class="label">1 对 1 专业指导</p>
              <span></span>
              <p>为客户提供一整套农业产业链的服务。为客户提供一整套农业产业链的服务。</p>
            </div>
          </div>
        </div>
        <div class="layui-col-sm6">
          <div class="content">
            <div class="content-left"><img src="/img/index/home_img4.jpg"></div>
            <div class="content-right">
              <p class="label">1 对 1 专业指导</p>
              <span></span>
              <p>为客户提供一整套农业产业链的服务。为客户提供一整套农业产业链的服务。</p>
            </div>
          </div>
        </div>
      </div>
      <div class="service-more"><a href="">查看更多</a></div>
    </div>
  </div>
  <!-- footer部分 -->
  <div class="footer">
    <div class="layui-container">
      <p class="footer-web">
        <a href="javascript:;">合作伙伴</a>
        <a href="javascript:;">企业画报</a>
        <a href="javascript:;">JS网</a>
        <a href="javascript:;">千图网</a>
        <a href="javascript:;">昵图网</a>
        <a href="javascript:;">素材网</a>
        <a href="javascript:;">花瓣网</a>
      </p>
      <div class="layui-row footer-contact">
        <div class="layui-col-sm2 layui-col-lg1"><img src="/img/index/erweima.jpg"></div>
        <div class="layui-col-sm10 layui-col-lg11">
          <div class="layui-row">
            <div class="layui-col-sm6 layui-col-md8 layui-col-lg9">
              <p class="contact-top"><i class="layui-icon layui-icon-cellphone"></i>&nbsp;400-8888888&nbsp;&nbsp;(9:00-18:00)</p>
              <p class="contact-bottom"><i class="layui-icon layui-icon-home"></i>&nbsp;88888888@163.com</span></p>
            </div>
            <div class="layui-col-sm6 layui-col-md4 layui-col-lg3">
              <p class="contact-top"><span class="right">该模板版权归 <a href="https://www.layui.com/" target="_blank">layui.com</a> 所有</span></p>
              <p class="contact-bottom"><span class="right">Copyright&nbsp;©&nbsp;2016-2018&nbsp;&nbsp;ICP&nbsp;备888888号</span></p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
<script src="/layui/layui.js"></script>
<!--[if lt IE 9]>
  <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
  <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<script>
  layui.config({
    base: '/js/'
  }).use('firm'); 
</script>
</body>
</html>